<style scoped>
	.el-row{
		margin: 20px 0 ;
	}
	.dialog__body{
		color: #0000009c  !important;
	}
	.tab_two_change{
		border-bottom: solid 1px #CCCCCC;
	
	}
	.tab_two_change span{
		display: inline-block;
		margin-right: 30px;
   		font-size: 17px;
   		cursor: pointer;
	}
	.tab_two_change span.active{
		border-bottom: solid 2px #3789dd;
	}
	.dialog__body .el-row .el-col span{
		color: #000000;
	}
	.dealPerson{
		float: right;
		margin: 0 120px 0 0 ;
	}

	.history p{
		display: inline-block;
	    background: #3789DD;
	    padding: 5px;
	    width: 100px;
	    vertical-align: middle;
	    vertical-align: -webkit-baseline-middle;
	    margin-bottom: 8px;
	    color: #FFFFFF;
	    cursor: pointer;
	}
	.history .chooseP{
		background: #01B754;
	}
	.info li{
		display: none;
	}
	.info .chooseP{
		display: block;
	}
	
	.history li{
		float: left;
		display: contents;
		text-align: center;
	}
	
	.el-dialog{
		min-width: 600px;
	}
    .detailType2 .el-input{
    	width: calc(100% - 180px);
    }
    
    .detailType3 .el-input{
    	width: calc(100% - 180px);
    }
    .diy_info{
    	    color: #606266;
    		word-break: break-all;
    }
</style>
<template>
	<section class="dialog__body">
		<div class="tab_two_change">
				<span :class="{'active':current==='baceInfo'}" @click="current='baceInfo'">基本信息</span>	
				<span :class="{'active':current==='liuCheng'}"  @click="current='liuCheng'">工单流程图</span>	
				<span :class="{'active':current==='pingjia'}"  v-if="type==='mydan'" @click="current='pingjia'">工单评价</span>	
		</div>
		
		<!--这是基本信息-->
		<div class="detail_info" v-show="current==='baceInfo'">
		<el-row>
		  <el-col :span="12">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">申请事项：</span><span class="diy_info">{{baceInfo.applyTitle}}</span>
		  	</div>
		  </el-col>
		  <el-col :span="12">
		  	<div class="grid-content bg-purple-light">
		  		<span class="span_title">申请时间：</span><span class="diy_info">{{baceInfo.createDate}}</span>
		  	</div>
		  </el-col>
		</el-row>
		
		<el-row>
		  <el-col :span="12">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">申 请 人：</span><span class="diy_info">{{baceInfo.userName}}</span>
		  	</div>
		  </el-col>
		  <el-col :span="12" v-if="baceInfo.phone">
		  	<div class="grid-content bg-purple-light">
		  		<span class="span_title">联系方式：</span><span class="diy_info">{{baceInfo.phone}}</span>
		  	</div>
		  </el-col>
		</el-row>
		
		<el-row>
		  <el-col :span="24">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">情况描述：</span><span class="diy_info">{{baceInfo.description}}</span>
		  	</div>
		  </el-col>
		</el-row>
		
		<el-row>
		  <el-col :span="24">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">辅助要求：</span><span class="diy_info">{{baceInfo.assistanceRequirements}}</span>
		  	</div>
		  </el-col>
		</el-row>
		
		<!--辅助资料s-->
		<el-row v-if="fujianURL.length!=0">
		  <el-col :span="12">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">辅助资料：</span> 
		  				<div v-for="item in fujianURL">
		  					<a class="btn btn-success btn-sm" :href="item.id" download=""  title="下载"  mce_href="#">{{item.oldName}}</a>
		  				</div>
		  				  <!--<div  @click="downFuJian(6)">2.案情介绍</div>-->
		  	</div>
		  </el-col>
		</el-row>
		<!--辅助资料e-->
		<!--环节信息s-->
		<el-row>
		  <el-col :span="24">
		  	<div class="grid-content bg-purple">
		  		<span class="span_title">工单历史处理流程</span>
		  		<ul class="history">
		  			<li style="border-radius: 50px;" class="" ><p class="">开始</p><i>-------></i></li>
		  			<li v-for="(item,index) in historyUl" ><p @click="changeHistoryLi(item.sId,$event,index)">{{item.nodeName}}</p><i v-if="index !=historyUl.length-1">-------></i></li>
		  		</ul>
		  	</div>
		  </el-col>
		</el-row>
		
		<el-row  >  
			<ul class="info">
				<li v-for = "(item,index) in historyUl" class="">
				  <el-col :span="12">
				  	<p class="grid-content bg-purple">
				  		<p class="" v-if="item.handleRecord.handleName"><span class="span_title">处理人：</span>{{item.handleRecord.handleName}}<span v-if="item.handleRecord.organizationName">/</span>{{item.handleRecord.organizationName}}</p>
				  		<p class="" v-if="item.handleRecord.createdDate"><span class="span_title">接收时间：</span>{{item.handleRecord.createdDate}}</p>
				  		<p class="" v-if="item.handleRecord.opinionName"><span class="span_title">处理结果：</span>{{item.handleRecord.opinionName}}</p>
				  		<p class="" v-if="item.handleRecord.opinion"><span class="span_title">处理说明：</span>{{item.handleRecord.opinion}}</p>
				  	</p>
				  </el-col>
				  <el-col :span="12">
				  		<p class="" v-if="item.handleTel"><span class="span_title">联系方式：</span>{{item.handleTel}}</p>
				  		<p class="" v-if="item.handleRecord.updatedDate"><span class="span_title">处理时间：</span>{{item.handleRecord.updatedDate}}</p>
						<div v-for="item in fujianNodeURL">
							<span class="span_title">附件下载：</span>
		  					<a class="btn btn-success btn-sm" :href="item.id" download=""  title="下载"  mce_href="#">{{item.oldName}}</a>
		  				</div>
				  </el-col>
			  	</li>
		  	</ul>
		</el-row>
		<!--环节信息e-->
		</div>
		
		<!--这是流程图-->
		<div class="detail_img" v-show="current==='liuCheng'" style="text-align: center;margin: 20px 0;">
			<img style="width: 100%;" :src="liuChengImg"/>
		</div>
		
		<!--评价页面-->
		<div class="detail_pingjia"  v-show="current==='pingjia'" style="text-align: center;margin: 20px;">
			<section v-for="(item,index) in pingjia">
				<p v-if="item.handlerUserRole ==='fenfa'">对分发人员评分</p>
				<p v-if="item.handlerUserRole ==='fankui'">对协同人员评分</p>
				<el-rate
				  :value ="item.level"
				  disabled
				  show-score
				  :max = 3
				  text-color="#ff9900"
				  score-template="{value}">
				</el-rate>
				 <el-input style="margin: 15px;" type="textarea" 
				 	autosize
				 	disabled
				 	:value = 'item.msg'
				 	></el-input>
			</section>
		</div>
		
		<!--从这里开始是不同的结构，根据不同的内容赋予不同的值，这里要后期多做几个li选项才行的-->
		<div class="" v-if="type==='waitdan'">
			<ul>
				<!--情况一-->
				<li class="detailType1" v-if="detailType == '1'">
					<el-row>
					  <el-col :span="12" v-if="detail.btn.length>1">
					  <div class="grid-content bg-purple">
					  		<span class="span_title">审核结果：</span>
					  		 <el-radio v-for = "item in detail.btn" v-model="detail.myRadio" @change="changeDetailType1(item)" :label="item.flowId">{{item.btnName}}</el-radio>
			  				 <!--<el-radio v-model="detailType1.myRadio" label="false">不同意</el-radio>-->
					  </div>
					  </el-col>
					  <el-col :span="24">
					  		<span class="span_title" >处理人员：</span>
					  			<el-row class="dealPerson" >
							  		<el-col :span="24">
							  			<el-input readonly v-model="detail.userName"  size="mini"  placeholder="请输入姓名" clearable></el-input>
									</el-col>
								</el-row>
								 <el-button type="primary" @click="detailType1changeShow">选择</el-button>
					  </el-col>
					</el-row>
					<el-row>
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">审核意见：</span>
					  		<el-input v-model="detail.myInput" placeholder="限100字" :maxlength='100'></el-input>
					  	</div>
					  </el-col>
					</el-row>
				</li>
				
				<!--情况二-->
				<li class="detailType2" v-if="detailType == '2'">
					<el-row  >
					  <el-col :span="12"  v-if="detail.btn.length>1">
					  	<span class="span_title">处理方式：</span>
					  	  	<!--<el-radio v-model="detailType2.myRadio"  label="0">数据录入</el-radio>-->
  							<el-radio v-for = "item in detail.btn" v-model="detail.myRadio"  @change="changeDetailType2(item.btnName)" :label="item.flowId">{{item.btnName}}</el-radio>
					  </el-col>
					</el-row>
					
					<div class="" v-if="detailType2.myRadio==0">
						<el-row>
						  <el-col :span="24">
						  	<div class="grid-content bg-purple">
						  		<span class="span_title">处理说明：</span>
						  		<el-input v-model="detail.myInput" :maxlength='500' placeholder="不超过500字" type="textarea" autosize='true'></el-input>
						  	</div>
						  </el-col>
						</el-row>
						
						<el-row>
						   <el-col :span="24">
						   		<span class="span_title">相关附件：</span>
						   		<el-upload
								  class="upload-demo"
								  ref="upload"
								  :action="uploadPath()"
								  :on-success = "handleSuccess"
								  :on-change = "handleChange"
								  :file-list="fileList3"
								  :before-upload = "beforeUpload"
								  :auto-upload="false">
								  <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
								   <!--<el-button slot="trigger" size="small" type="primary">上传</el-button>-->
								</el-upload>
						   	</el-col>
					</el-row>
					</div>
					
					<div class="" v-if="detailType2.myRadio==1">
						<el-row>
						  <el-col :span="24">
						  	<div class="grid-content bg-purple">
						  		<span class="span_title">处理部门：</span>
						  		<input type="text" style="width: 200px;" class="el-input__inner"  v-model="detail.userName" />
						  		 <el-button type="primary" @click="detailType2chooseBrans">选择</el-button>
						  	</div>
						  </el-col>
						</el-row>		
						
						<el-row>
						  <el-col :span="24">
						  	<div class="grid-content bg-purple">
						  		<span class="span_title">处理说明：</span>
						  		<el-input v-model="detail.myInput" :maxlength='500' placeholder="不超过500字" type="textarea" autosize='true'></el-input>
						  	</div>
						  </el-col>
						</el-row>
						
						<el-row>
						  <el-col :span="24">
						  	<div class="grid-content bg-purple">
						  		<span class="span_title">处理说明：</span>
						  		<span>请{{detail.userName}}部门协助提供!</span>
						  	</div>
						  </el-col>
						</el-row>	
					</div>	
				</li>
				
				<!--情况三-->
				<li class="detailType3" v-if="detailType == '3'">
					<el-row  >
					  <el-col :span="24"  v-if="detail.btn.length>1">
					  	<span class="span_title">处理方式：</span>
					  	  <el-radio v-for = "item in detail.btn" v-model="detail.myRadio" :label="item.flowId">{{item.btnName}}</el-radio>
					  </el-col>
					</el-row>
					
					<el-row>
						  <el-col :span="24">
						  	<div class="grid-content bg-purple">
						  		<span class="span_title">处理说明：</span>
						  		<el-input v-model="detail.myInput" :maxlength='500' placeholder="不超过500字" type="textarea" autosize='true'></el-input>
						  	</div>
						  </el-col>
					</el-row>
						
					<el-row>
						   <el-col :span="24">
						   		<span class="span_title">相关附件：</span>
						   		<el-upload
								  class="upload-demo"
								  ref="upload"
								  :action="uploadPath()"
								  :on-success = "handleSuccess"
								  :on-change = "handleChange"
								  :file-list="fileList3"
								  :before-upload = "beforeUpload"
								  :auto-upload="false">
								  <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
								   <!--<el-button slot="trigger" size="small" type="primary">上传</el-button>-->
								</el-upload>
						   	</el-col>
					</el-row>
				</li>
				
				<!--情况4-->
				<li class="detailType4" v-if="detailType == '4'">
					<el-row  >
					  <el-col :span="24"  v-if="detail.btn.length>1">
					  	<span class="span_title">处理方式：</span>
					  	  <el-radio v-for = "item in detail.btn" v-model="detail.myRadio" :label="item.flowId">{{item.btnName}}</el-radio>
					  </el-col>
					</el-row>
					
					<el-row>
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">签收意见：</span>
					  		<el-input v-model="detail.myInput" placeholder="限100字" :maxlength='100'></el-input>
					  	</div>
					  </el-col>
					</el-row>
				</li>
				
				<!--情况5-->
				<li class="detailType5" v-if="detailType == '5'">
					<el-row>
					  <el-col :span="12"  v-if="detail.btn.length>1">
					  	<span class="span_title">处理方式：</span>
					  	  	<el-radio v-for="item in detail.btn" v-model="detail.myRadio" @change="changRadio(item,item.btnName)"  :label="item.flowId">{{item.btnName}}</el-radio>
  							<!--<el-radio v-model="detail.myRadio"  label="1">不签收</el-radio>-->
					  </el-col>
					  
					  <el-col :span="12" v-if="detailType5.myRadio === 1">
					  	<span class="span_title">审核意见：</span>
					  	  	<el-input v-model="detail.myInput" placeholder="限100字" :maxlength='100'></el-input>
					  </el-col>
					</el-row>
					
					<el-row>
					  <!--<el-col :span="12">
					  	<span class="span_title">处理方式：</span>
					  	   <el-select v-model="detailType5.mySelect" placeholder="请选择">
						    <el-option label="本部门" value="0"></el-option>
						    <el-option label="外部门" value="1"></el-option>
						  </el-select>
					  </el-col>-->
					   
					   <el-col :span="12" v-if="detailType5.myRadio === 0">
					  	<span class="span_title" v-if="detailType5.mySelect==='0'">处理人员：</span>
					  	<!--<span class="span_title" v-else>处理部门：</span>-->
					  	<input type="text" style="width: 120px;" class="el-input__inner"  v-model="detail.userName" />
					  	<el-button type="primary" @click = "detailType5chooseBrans">选择</el-button> 	
					   </el-col>
					  
					</el-row>
				</li>
				
				<!--情况6-->
				<li class="detailType6" v-if="detailType == '6'">
					<el-row >
					  <el-col :span="24"  v-if="detail.btn.length>1">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">审核结果：</span>
					  		<el-radio v-for="item in detail.btn" v-if="item.flowVariable!='${flag==100}'" v-model="detail.myRadio"  :label="item.flowId">{{item.btnName}}</el-radio>
					  	</div>
					  </el-col>
					</el-row>
					
					<el-row>
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">审核意见：</span>
					  		<el-input v-model="detail.myInput" placeholder="限100字" :maxlength='100'></el-input>
					  	</div>
					  </el-col>
					</el-row>
				</li>
				
				<!--情况7-->
				<li class="detailType6" v-if="detailType == '7'">
					<el-row>
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">审核结果：</span>
					  		<el-radio v-for="item in detail.btn" v-model="detail.myRadio" @change="changeDetailType7(item,item.btnName)" :label="item.flowId">{{item.btnName}}</el-radio>
					  		<!--<el-radio  v-model="detail.myRadio"  label="0">同意</el-radio>-->
					  	</div>
					  </el-col>
					</el-row>
					
					<el-row v-show="detailType7.shenhe">
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">是否需要上级领导审核：</span>
					  		<!--<el-radio v-for="item in detail.btn" v-model="detail.myRadio" @change="changeDetailType7(item,item.btnName)" :label="item.flowId">{{item.btnName}}</el-radio>-->
					  		<el-radio  v-model="detailType7.myRadio2" @change="changeDetailType7(1,'是')" label="1">是</el-radio>
					  		<el-radio  v-model="detailType7.myRadio2" @change="changeDetailType7(0,'否')" label="0">否</el-radio>
					  	</div>
					  </el-col>
					</el-row>
					
					<el-row v-show="detailType7.shenhe2">
					  <el-col :span="24">
					  	<div class="grid-content bg-purple">
					  		<span class="span_title">审核意见：</span>
					  		<el-input v-model="detail.myInput" placeholder="限100字" :maxlength='100'></el-input>
					  	</div>
					  </el-col>
					</el-row>
					
					<el-row v-show="detailType7.shenhe3">
					   <el-col :span="24" >
					  	<span class="span_title">处理人员：</span>
					  	<input type="text" style="width: 120px;" class="el-input__inner"  v-model="detail.userName" />
					  	<el-button type="primary" @click = "detailType5chooseBrans">选择</el-button> 	
					   </el-col>
					  
					</el-row>
				</li>
				
			</ul>
		</div>
		
		<p style="text-align: center;" v-if="type==='waitdan'">
			<el-button type="primary" @click = "submitDetail">确定</el-button>
 		 	<el-button type="danger" @click = "closeDialog">取消</el-button>
		</p>
		 
		 <p v-if="type==='mydan'"  style="text-align: center;"><el-button  @click = "closeDialog"  type="primary">关闭</el-button></p>
	
		<!--不同的情况调出不同的弹窗-->
		<el-dialog center=true append-to-body=true title="选择处理人员" :visible.sync="detailType1innerVisible" :modal=false  width="460px">
		  		<small-adress @choosePeople="choosePeople" :handleIds="handleIds"></small-adress>
		</el-dialog>
		
		<el-dialog center=true append-to-body=true title="选择处理部门" :visible.sync="detailType2innerVisible" :modal=false  width="460px">
				<small-brans @chooseBrans="chooseBrans"></small-brans>
		</el-dialog>
		
		<el-dialog center=true append-to-body=true :title="detailType5.mySelect=='0'?'选择处理人员':'选择处理部门'" :visible.sync="detailType5innerVisible" :modal=false  width="460px">
		  		<!--<small-adress @choosePeople="choosePeople" v-if="detailType5.mySelect=='0'"></small-adress>-->
		  		<!--<small-brans  @chooseBrans="chooseBrans" v-if="detailType5.mySelect=='1'"></small-brans>-->
		  		<small-adress @choosePeople="choosePeople" :handleIds="handleIds"></small-adress>
		</el-dialog>
		
	</section>
</template>

<script>
	import {apiShowPingJia,apiWaitDanDetail,apiSubmitDetail,apiShowLiuCheng,uploadPath,apiShowFuJian,apiDown,apiUpload,apiShowNode,apiGuanLian} from "../css_img_js/xieTongApi.js"
	import logoSrc from '../../../images/liucheng.png'
	import smallAdress from './xietongAdress'
	import smallBrans from './xietongBrans'
	import xietongPingjia from './xietongPingjia'
	export default{
		components:{
			smallAdress,
			smallBrans,
			xietongPingjia
		},
		props:{
			taskId:null,
			formId:null,
			type:'',
		},
		data(){
			return{
				handleIds:'',/*btn环节选人，这是部门id*/
				fujianNodeURL:[],/*环节附件*/
				fujianURL:[],/*工单附件*/
				uploadId:'',
				detailType:'',/*当前的工单详情类型为*/
				noteType:'',/*当前的环节类型*/
				current:'baceInfo',
				params:{},/*需要传的参数*/
				fileList3:[],/*保持已经上传的filelist*/
				fileList4:[],/*保存未上传的filelist*/
				maxSize:1073741824,/*1Gb*/
				alertmsg:'总文件不能超过1Gb',
				historyLi:'',
				historyUl:[/*环节信息*/
				],
				nodeType:{/*节点配置*/
					btn:"",
				},
				liuChengImg:logoSrc,
				detailType1innerVisible:false,
				detailType2innerVisible:false,
				detailType5innerVisible:false,
				baceInfo:{/*详细信息*/
				},
				processInstanceId:null,/*流程实例的id，根据这个流程实例找到流程图*/
				sid:'-1',/*当前环节的id，根据这个id去辨认当前的环节，去上传附件*/
				detailType2fileList3:'',
				detail:{
					myRadio:'',
					myInput:'',
					myBtn:'',
					handleType:'',
					handleIds:'',/*人员id*/
					userName:'',
					mySelect:'',
					bransId:'',/*部门id*/
				},
				detailType1:{
					myRadio:'',
					myInput:'',
				},
				detailType2:{
					myRadio:'null',
					myInput:'',
				},
				detailType3:{
					myRadio:'',
				},
				detailType4:{
					myRadio:'',
				},
				detailType5:{
					myRadio:'',
					mySelect:'0',
				},
				detailType6:{
					myRadio:'',
				},
				detailType7:{
					myRadio:'',
					myRadio2:'',
					shenhe:false,
					shenhe2:false,
					shenhe3:false,
				},
				pingjia:[
				],
			}
		},
		methods:{
			changeDetailType7(val,name){/*类型7的处理*/
				console.log(val);
				console.log(name);
				if(name==='同意'){/**/
					this.detailType7.shenhe =true;
					this.detailType7.shenhe2 =false;
				}else if(name === '不同意'){
					this.detailType7.shenhe =false;
					this.detailType7.shenhe2 =true;
				}else if(name === '否'){/*同一方法直接处理，管不了那么多了*/
					this.detailType7.shenhe3 = true;
				}else if(name ==='是'){/*同一方法直接处理，管不了那么多了*/
					this.detailType7.shenhe3 = false;
				}
			},
			changeDetailType1(val){/*情况1*/
				this.handleIds = val.targetNode.handleIds;
			},
			changRadio(val,name){/*点击按钮,类型5的多选*/
				this.handleIds = val.targetNode.handleIds;
				if(name==='同意'){
					this.detailType5.myRadio=0;
				}else if(name ==='不同意'){
					this.detailType5.myRadio=1;
				}
			},
			changeDetailType2(name){/*类型二的处理*/
				console.log(name);
				if(name==='数据录入'||name==='数据'||name==='录入'){
					this.detailType2.myRadio=0;
				}else if(name ==='指派其它部门'||name ==='指派部门'||name ==='指派其它'||name==='指派'){
					this.detailType2.myRadio=1;
				}
			},
			changeHistoryLi(val,ev,index){/*点击选中环节名称*/
				let lis = document.getElementsByClassName('history')[0].children;
				let divs = document.getElementsByClassName('info')[0].children;
				for (let i = 0; i < lis.length; i++) {
					lis[i].firstChild.className="";
				}
				for(let i = 0; i<divs.length;i++){
					divs[i].className="";
				}
				console.log(ev);
				ev.target.className='chooseP';
				divs[index].className="chooseP";
				if(this.params.formId!=''){
					apiShowFuJian(this,this.params.formId,val);
				}
				
			},
			closeDialog(){/*关闭弹窗*/
				this.$emit('closeDialog');
			},
			submitDetail(){/*工单提交详情*/
				const loading = this.$loading({
				      text: '提交中',
				      target: document.querySelector('.dialog__body')
				});
				
				if(this.fileList4.length!=0){/*先上传文件*/
					this.$refs.upload.submit();
				}else{
					this.submitDeatilAll();
				}
//				apiSubmitDetail(this,{taskId:this.taskId,inputFrom:this.detail}).then(()=>{
//						loading.close();
//						this.$emit('refresh');
//				})
			},
			submitDeatilAll(){/*真正地全部提交*/
				if(this.detail.btn.length===1){
					this.detail.myRadio = this.detail.btn[0].flowId;
				}
				apiSubmitDetail(this,{taskId:this.taskId,inputFrom:this.detail}).then(()=>{
						loading.close();
						this.$emit('refresh');
				})
			},
			requestDetail(){/*请求,打开工单详情*/
				const loading = this.$loading({
				      text: '加载中',
				      target: document.querySelector('.dialog__body')
				});
				console.log(this.formId,this.taskId);
				if(this.type == 'waitdan'){
					this.params = {
						"formId" :this.formId,
						"taskId":this.taskId
					}
				}else if(this.type == 'mydan'){
					this.params = {
						"formId" :this.formId,
					}
				}
				let _this = this;	
				_this.processInstanceId = null;
				_this.liuChengImg =null;
				apiWaitDanDetail(this,this.params).then(()=>{
					if(_this.processInstanceId!=null){
						apiShowLiuCheng(_this,_this.processInstanceId)/*工单显示的流程图片*/
						apiShowNode(_this,_this.processInstanceId)/*工单显示的环节信息*/
						apiShowPingJia(_this,_this.processInstanceId)/*工单显示的评价*/
					}
					if(_this.params.formId!=''){
						apiShowFuJian(_this,_this.params.formId,'-1');/*显示工单附件*/
					}
					loading.close();
				})
			},
			detailType1changeShow(){/*de1打开小dialog*/
				console.log(this.detail);
				if(this.handleIds===''){/*没有东西*/
					this.handleIds = this.detail.btn[0].targetNode.handleIds;
				}
				this.detailType1innerVisible =true;
			},
			detailType2chooseBrans(){/*de2打开部门选择*/
				if(this.handleIds===''){/*没有东西*/
					this.handleIds = this.detail.btn[0].targetNode.handleIds;
				}
				this.detailType2innerVisible =true;
			},
			detailType5chooseBrans(){/*de5的打开选择*/
				if(this.handleIds===''){/*没有东西*/
					this.handleIds = this.detail.btn[0].targetNode.handleIds;
				}
				this.detailType5innerVisible =true;
			},
			choosePeople(val){/*选人*/
				console.log(val);
				this.detail.handleIds=val.userId;
				this.detail.userName=val.username;
				this.detailType1innerVisible=false;
				this.detailType2innerVisible=false;
				this.detailType5innerVisible=false;
			},
			chooseBrans(val){/*选部门*/
				this.detail.bransId =val.bransId;
				this.detail.userName=val.bransname
				this.detailType1innerVisible=false;
				this.detailType2innerVisible=false;
				this.detailType5innerVisible=false;
			},
			uploadPath(){/*返回上传地址*/
				return apiUpload();
			},
			downFuJian(val){/*文件下载*/
				apiDown(this,val);
			},
			beforeUpload(file){/*图片上传前检验*/
		    	/*检验文件是否超过限定的大小*/
		    	let this_size = 0;
		    	let go_on = true;
		    	console.log('beforeUpload');
				for(let i in this.fileList4){
					this_size+=this.fileList4[i].size;
					if(this_size>=this.maxSize){
						go_on = false;
						this.$message.error(this.alertmsg);
						return false;
					}
				}
				console.log(this.fileList3);
		    },
			handleChange(file, fileList){/*处理变化*/
				let this_size = 0;
				for(let i in fileList){
					this_size+=fileList[i].size;
					if(this_size>=this.maxSize){
						alert(this.alertmsg);
						    this.$notify.error({
					          title: '错误',
					          message: this.alertmsg,
					        });
					}/*存入数据中*/
				}
				this.fileList4 = fileList;
				console.log(this.fileList4)
			},
		    handleSuccess(response, file, fileList){
		    	console.log(JSON.parse(response));
		    	let parse_json = JSON.parse(response);
		    	if(parse_json.code==='200'||parse_json.code===200){
		    		this.uploadId = parse_json.id;
		    		apiGuanLian(this.uploadId,this.params.formId,this.sid);/*关联工单id，上传文件id，环节id*/
//		    		this.$message.success('申请成功，请在我的工单页面查询');
					this.submitDeatilAll();
//		    		this.loadingClose();
		    	}
		    	console.log(response);
		    	if(response.code==='200'){
		    		this.unloadAll();
		    	}
		    	console.log(file);
		    	console.log(fileList);
		    },
		},
		mounted(){
				this.requestDetail();
		},
		watch:{
			  formId(newVal, oldVal){
			      this.requestDetail();
			      Object.assign(this.$data, this.$options.data())/*重置vue中的data*/
			  }
		}
		
	}
</script>

